html{
    margin:0px;
    min-height: 100%;
    position: relative;
}
body{
    font-family: "Open Sans", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
    font-size: 14px;
    margin:0px;
    min-height: 100%;
    overflow-x: hidden;
    background-color: #f0f0f0;
   
}
.gray-bg {
     background-color: #f0f0f0;
}
.left{
    float: left;
}
.right{
    float: right;
}
.red{
    color: #F2515E;
}
.red-bg{
    background-color: #F2515E;
    border: 1px solid #F2515E; /* See also .circle.red-bg */
    color: #FFF;
}
.blue{
    color: #00698C;
}
button{
    background-color: #FFF;
}
/* NAVIGATION */
aside{
    background-color: #222;
    bottom: 0;
    color: #FFF;
    left: 0;
    position: absolute;
    top: 0;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    width: 240px;
}
aside nav{
    background-color: #222;
    padding-bottom: 30px;
}
aside hr{
    border-color: #333;
    margin: 0;
}
aside i{
    font-size: 14px;
    margin-right: 10px;
}   
aside i.Spreaders{
    float: right;
    line-height: 45px;
}
aside .logo{
    display: block;
    line-height: 80px;
    padding: 0 35px;
    width: 100%;
}
aside .logo img{
    width: 100%;
}
aside .views a{
    color: #FFF;
    display: block;
    font-size: 16px;
    font-weight: bold;
    line-height: 45px;
    padding: 0 35px;
}
aside .views a:hover{
    color: #F2515E;
    text-decoration: none;
}
aside .actions{
    padding: 0 35px;
}
aside .actions span{
    font-size: 24px;
    font-weight: bold;
    line-height: 45px;
}
aside .actions p{
    margin: 0;
}
aside .actions button{
    background-color: #222;
    border: 1px solid #333;
    -webkit-border-radius: 4px;
    -moz-border-radius:    4px;
    border-radius:         4px;
    color: #FFF;
    line-height: 28px;
    margin: 15px 0;
    padding: 0 10px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
aside .actions button:hover{
    background-color: #F2515E;
    border-color: #F2515E;
}
aside .contact p{
    font-size: 12px;
    margin: 30px 0 0 0;
    padding-left: 35px;
}
aside .contact p:last-child{
    color: #444;
}
aside .contact a{
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
aside .contact a:hover{
    color: #f0111a;
    text-decoration: none;
}

aside .footer-links{
    padding: 10px 35px;
    font-size: 12px;


}
aside .footer-links ul{ 
    margin: 0 auto;
    padding: 0;
     
}
aside .footer-links ul li{ 
    list-style: none;
     
}
aside .footer-links ul li a{
    text-align: left;
    display: block;
    line-height: 20px;
    margin-top: 10px;
    color: #888;

}
aside .footer-links ul li a:hover{ 
    color: #F2515E;

}

aside .footer-links p{
    color: #444;
    margin-top: 20px;

}
aside .footer-links p a{ 
  color: #666;
}
aside .footer-links p a:hover{ 
  color: #F2515E;
}

/* END NAVIGATION */

/* WHITE BLOCK */
/* USER */
.main-content{
    color: #444;
    left: 0;
    margin-left: 240px;
    position: relative;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.main-content hr{
    border-color: #dddddd;
    margin: 0;
}
.main-content header{
    color: #999;
    height: 80px;
    line-height: 80px;
    padding-right: 20px;
    position: relative;
    background-color: #fff;
}
.main-content header .open-sidebar{
    cursor: pointer;
    display: none;
    height: 80px;
    line-height: 80px;
    margin-left: 10px;
    text-align: center;
    width: 32px;
    -webkit-transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    -ms-transition: color 0.2s ease;
    -o-transition: color 0.2s ease;
    transition: color 0.2s ease;
}
.main-content header .open-sidebar:hover{
    color: #999;
}
.main-content header .open-sidebar i{
    vertical-align: middle;
}
.main-content header .user{
    margin-left: 10px;
    cursor: pointer;
}
.main-content header .user .current{
    padding: 0 10px;
}
.main-content header .user img{
    height: 40px;
}
.main-content header .user span{
    color: #444;
    font-size: 16px;
    font-weight: bold;
    margin: 0 15px;
    vertical-align: bottom;
}
.main-content header .user .current i{
    -webkit-transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    -ms-transition: color 0.2s ease;
    -o-transition: color 0.2s ease;
    transition: color 0.2s ease;
}
.main-content header .user .current:hover i{
    color: #444;
}
.main-content header .user li{
    height: 60px;
    line-height: 1.2;
    padding: 0 10px;
}
.main-content header .user li .name{
    color: #444;
    font-size: 16px;
    font-weight: bold;
    height: 60px;
    line-height: 60px;
    margin: 0 22px 0 50px;
    vertical-align: bottom;
    white-space: nowrap;
}
.main-content header .user li i{
    height: 60px;
    line-height: 60px;
    -webkit-transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    -ms-transition: color 0.2s ease;
    -o-transition: color 0.2s ease;
    transition: color 0.2s ease;
}
.main-content header .user li img{
    margin-top: 10px;
}
.main-content header .user li:hover i{
    color: #444;
}
.main-content header a{
    color: #999;
    cursor: pointer;
    display: block;
}
.main-content header a:hover{
    color: #444;
    text-decoration: none;
}
.main-content header .url{
    margin-left: 10px;
}
.main-content header .url i{
    margin-left: 12px;
    -webkit-transition: opacity 0.2s ease;
    -moz-transition: opacity 0.2s ease;
    -ms-transition: opacity 0.2s ease;
    -o-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
}
.main-content header .url .fa-link{
    display: none;
}
.main-content header .url .fa-long-arrow-right{
    opacity: 0;
}
.main-content header .url:hover i{
    opacity: 1;
}
.main-content header .settings{
    cursor: pointer;
    margin-left: 5px;

}
.main-content header .settings .current:hover{
    color: #999;
}
.main-content header .settings i{
    margin: 10px;
    line-height: 1.8;
}
.main-content header .settings .fa-user{
    font-size: 14px;
}
.main-content header .settings ul{
    left: auto;
    min-width: 60px;
    right: 0px;
    top: 65px;
}
.main-content header .settings li{
    padding: 0;
    white-space: nowrap;
}
.main-content header .settings li h5{
    color: #444;
    margin: 0 0 5px 0;
    padding: 0 15px 5px 15px;
    border-bottom: 1px solid #dddddd;
    line-height: 30px;
    font-weight: bold;
}
.main-content header .settings li a{
    color: #ccc;
    display: block;
    line-height: 30px;
    margin: 0;
    padding: 0 15px;
}
.main-content header .settings li a:hover{
    background-color: #FFF;
    color: #999;
    text-decoration: none;
}
.main-content header .edit span{
    margin: 5px;
}
.main-content header .search{
    margin: 0 10px 0 20px;
    position: relative;
}
.main-content header .search input{
    background-color: transparent;
    border: 1px solid #dddddd;
    -webkit-border-radius: 15px;
    -moz-border-radius:    15px;
    border-radius:         15px;
    box-shadow: none;
    height: 30px;
    line-height: 28px;
    padding: 0 10px 0 30px;
    position: relative;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    width: 90px;
    z-index: 12;
}
.main-content header .search ::-webkit-input-placeholder:before { /* WebKit browsers */
    color:    #ccc;
    content: "Search";
}
.main-content header .search :-moz-placeholder:before { /* Mozilla Firefox 4 to 18 */
    color:    #ccc;
    content: "Search";
}
.main-content header .search ::-moz-placeholder:before { /* Mozilla Firefox 19+ */
    color:    #ccc;
    content: "Search";
}
.main-content header .search :-ms-input-placeholder:before { /* Internet Explorer 10+ */
    color:    #ccc;
    content: "Search";
}
.main-content header .search i{
    left: 9px;
    position: absolute;
    top: 33px;
    z-index: 11;
}
.main-content header .search input:focus{
    background-color: #FFF;
    outline: none;
    padding: 0 15px;
    width: 150px;
}
.main-content header .search .close-for-small{
    color: #444;
    cursor: pointer;
    display: none;
    line-height: 30px;
    height: 30px;
    position: absolute;
    right: 20px;
    text-align: center;
    top: 15px;
    width: 30px;
    z-index: 12;
}
.main-content header .search .close-for-small i{
    top: 50%;
    margin-top: -7px;
}
.main-content header .search-overlay{
    background-color: #fff;
    bottom: 0;
    display: none;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
}

.main-content header .user .set-up {
   background-color: #F2515E;
    line-height: 40px;   
    margin-top: 20px;
    -webkit-border-radius: 4px;
    -moz-border-radius:    4px;
    border-radius:         4px;
    color: #fff !important;
    margin-left: 10px;
}
.main-content header .user .set-up:hover {
    background-color: #f0111a;
}
.main-content header .user .set-up span {
    color: #fff !important;
}
/* END USER */


/* MAIN SECTION */

.main-content section{
    padding: 0 20px;
    width: 100%;

}

.main-content section .main-top{
    height: 100px;
    padding: 27px 0;
    vertical-align: middle;
}
.main-content section .main-top h2{
    font-size: 30px;
    font-weight: bold;
    line-height: 46px;
    margin: 0;
}
.main-content section .main-top .sort{
    color: #ccc;
    cursor: pointer;
}
.main-content section .main-top .sort p{
    line-height: 46px;
    float: left;
}
.main-content section .main-top .sort label{
    font-weight: bold;
    line-height: 46px;
}
.main-content section .main-top .sort .dropdown{
    margin: 8px 0px 0 10px;
}
.main-content section .main-top .sort .dropdown ul{
    min-width: 110px;
}
.main-content section .main-top .sort .dropdown li{
    line-height: 30px;
    padding: 0 12px;
}
.main-content section .main-top .sort .dropdown li:hover{
    color: #999;
}
.main-content section .main-top .sort .current{
    border: 1px solid #ddd;
    -webkit-border-radius: 4px;
    -moz-border-radius:    4px;
    border-radius:         4px;
    height: 30px;
    line-height: 1;
    padding: 7px 10px 0 12px;
    width: 110px;
    background-color: #fff;
}
.main-content section .main-top .sort .order{
    border: 1px solid #ddd;
    -webkit-border-radius: 4px;
    -moz-border-radius:    4px;
    border-radius:         4px;
    cursor: pointer;
    height: 30px;
    line-height: 30px;
    margin: 8px 0px 0 0;
    text-align: center;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    width: 30px;
    background-color: #fff;
}
.main-content section .main-top .sort .order:hover{
    background-color: #F2515E;
    border-color: #F2515E;
    color: #FFF;
}
.main-content section .main-top .red-button{
    -webkit-border-radius: 4px;
    -moz-border-radius:    4px;
    border-radius:         4px;
    font-weight: bold;
    height: 30px;
    line-height: 28px;
    margin-top: 8px;
    margin-left: 30px;
    padding: 0 10px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.main-content section .main-top .red-button:hover{
    background-color: #f0111a;
    border-color: #f0111a;
    color: #FFF;
    text-decoration: none;
}
.main-content section .main-top .red-button span{
    margin-left: 10px;
}
.main-content section .main-top .steps{
    cursor: default;
    line-height: 44px;
}
.main-content section .main-top .steps .circle{
    border: 1px solid #dddddd;
    -webkit-border-radius: 23px;
    -moz-border-radius:    23px;
    border-radius:         23px;
    font-size: 18px;
    margin-left: 13px;
    text-align: center;
    width: 46px;
}
.main-content section .main-top .steps .circle.red-bg{
    border-color: #F2515E;
}

.white-box {
    border: 1px solid #dddddd;
    background-color: #ffffff;
    padding: 10px 20px;
    margin-bottom: 20px;
    -webkit-border-radius: 5px;
    -moz-border-radius:    5px;
    border-radius:         5px;
    overflow-x:auto;
}

.main-content section .shout{
    padding: 0 20px;
    
}



.main-content section .shout:hover {
    border: 1px solid #cccccc;
}

.main-content section .draft{
    color: #666666;
    text-align: center;
    margin-right: 10px;
}

.main-content section .draft-tag {
    color: #ffffff;
    background-color: #F2515E;
    -webkit-border-radius: 3px;
    -moz-border-radius:    3px;
    border-radius:         3px;
    text-align: center;
    float: right;
   padding:0 5px;
   margin-top: 0px;
   margin-right: 10px;
}

.main-content section .shout .shout-head{
    margin: 20px 0;
}

.main-content section .shout .shout-head > *{
    line-height: 20px;
}
.main-content section .shout .shout-head h3{
    font-size: 14px;
    font-weight: bold;
    margin: 0;
}
.main-content section .shout .shout-head span{
    font-size: 12px;
}
.main-content section .shout p{
    font-style: italic;
    line-height: 18px;
    margin: 0;
    max-width: 680px
}
.main-content section .shout .shout-foot{
    color: #ccc;
    height: 80px;
    line-height: 80px;
    font-size: 12px;
}
.main-content section .shout .shout-foot a{
    color: #ccc;
    margin-right: 20px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.main-content section .shout .shout-foot a:hover{
    color: #999;
    text-decoration: none;
}
.main-content section .shout .shout-foot i{
    margin-right: 5px;
}
.main-content section .shout .shout-foot button{
    border: 1px solid #dddddd;
    -webkit-border-radius: 4px;
    -moz-border-radius:    4px;
    border-radius:         4px;
    color: #ccc;
    line-height: 28px;
    padding: 0 12px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.main-content section .shout .shout-foot button:hover{
    background-color: #F2515E;
    border-color: #F2515E;
    color: #FFF;
}
.main-content section .edition hgroup{
    margin-bottom: 40px;
    margin-top: 20px;
}
.main-content section .edition hgroup h3{
    font-size: 30px;
    font-weight: normal;
    line-height: 1;
    margin: 0 0 15px 0;
}
.main-content section .edition hgroup h4{
    font-size: 14px;
    font-style: italic;
    font-weight: normal;
    line-height: 1;
    margin: 0;
}
.main-content section .edition h5{
    font-size: 14px;
    font-weight: bold;
    line-height: 1;
    margin: 0 0 15px 0;
}
.main-content section .edition label{
    display: block;
    font-size: 14px;
    font-weight: bold;
    line-height: 1;
}
.main-content section .edition label span{
    font-size: 12px;
    font-weight: normal;
}
.main-content section .edition fieldset{
    margin-bottom: 35px;
}
.main-content section .edition fieldset .btn{
    border: 1px solid #dddddd;
    font-weight: normal;
    line-height: 38px;
    margin-bottom: 0;
    padding: 0 22px;
}
.main-content section .edition fieldset .btn:hover{
    color: #F2515E;
}
.main-content section .edition fieldset .btn.active{
    color: #F2515E;
}
.main-content section .edition fieldset select{
    border: 1px solid #dddddd;
    box-shadow: none;
    color: #ccc;
    height: 40px;
    max-width: 220px;
    padding: 9px 12px;
    width: 220px;
}
.main-content section .edition fieldset input[type="text"]{
    border: 1px solid #dddddd;
    box-shadow: none;
    color: #ccc;
    height: 40px;
    max-width: 480px;
    padding: 9px 12px;
}
.main-content section .edition fieldset textarea{
    border: 1px solid #dddddd;
    box-shadow: none;
    color: #ccc;
    height: 120px;
    max-width: 480px;
    padding: 9px 12px;
}
.main-content section .edition fieldset a{
    color: #ccc;
    line-height: 40px;
    margin-left: 15px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.main-content section .edition fieldset a i{
    margin-right: 5px;
}
.main-content section .edition fieldset button{
    border: 1px solid #dddddd;
    -webkit-border-radius: 4px;
    -moz-border-radius:    4px;
    border-radius:         4px;
    color: #ccc;
    line-height: 38px;
    margin-left: 15px;
    padding: 0 12px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.main-content section .edition fieldset button i{
    margin-right: 7px;
}
.main-content section .edition fieldset button:hover{
    color: #fff;
    background-color: #F2515E;
    border-color: #F2515E;
}
.main-content section .edition fieldset a:hover{
    color: #999;
    text-decoration: none;
}
.main-content section .edition fieldset .hint{
    font-size: 12px;
    color: #999;
}
.main-content section .edition fieldset .character-count{
    font-size: 12px;
    color: #999;
    margin-top: 10px;
}
.main-content section .edition fieldset .img-area{
    border: 1px dotted #dddddd;
    -webkit-border-radius: 4px;
    -moz-border-radius:    4px;
    border-radius:         4px;
    color: #CCC;
    font-size: 28px;
    line-height: 90px;
    margin-top: 20px;
    text-align: center;
    width: 90px;
}
.main-content section .edition fieldset .img-area.circle{
    -webkit-border-radius: 45px;
    -moz-border-radius:    45px;
    border-radius:         45px;
}


/* TABLE */
.main-content section table{
    color: #999;
    text-align: center;
}
.main-content section table{
    text-align: center;
}
.main-content section table tr > *:first-child{
    text-align: left;
    padding-left: 10px;
}
.main-content section table th{
    color: #999;
    border: none;
    font-weight: normal;
    line-height: 60px;
    padding: 0;
    text-align: center;
}
.main-content section table td{
    line-height: 60px;
    padding: 0;
}
.main-content section table td a{
    color: #999;
    padding: 0 3px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.main-content section table td a:hover{
    color: #444;
}
.main-content section table td img{
    margin-right: 10px;
}
.main-content section table td i{
    margin: 0 3px;
}
.main-content section table td:first-child{
    color: #444;
    font-weight: bold;
}
.main-content section table .totals{
    font-weight: bold;
}
.main-content section table select{
    display: none;
    height: 30px;
    line-height: 30px;
    margin: 15px auto;
    border-color: #ccc;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}
.main-content section table .dropdown{
    color: #444;
    background-color: #FFF;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    font-size: 14px;
    height: 30px;
    line-height: 30px;
    margin: 14px auto;
    width: 100px;
    padding: 0 10px;
    text-align: left;
    border: 1px solid #ccc;
}
.main-content section table .dropdown i{
    line-height: 30px;
}
.main-content section table .dropdown ul{
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    min-width: 100px;
}
.main-content section table .dropdown ul li{
    padding: 0 10px;
    border: none;
    line-height: 30px;
    height: 30px;
}
.main-content section table .dropdown ul li a{
    text-decoration: none;
    float: none;
    line-height: 30px;
    font-size: 14px;
    padding: 0;
}
.main-content section table .dropdown ul li a:hover{
    background-color: #FFF;
    background-image: none;
    color: #999;
}
/* END TABLE */


.main-content section .edition .preview{
    background-color: #FAFAFA;
    border: 1px solid #dddddd;
    -webkit-border-radius: 5px;
    -moz-border-radius:    5px;
    border-radius:         5px;
    cursor: default;
    margin: 0;
    max-width: 900px;
    overflow: hidden;
}
.main-content section .edition .preview > div{
    margin-bottom: -1000px;
    padding: 0px 20px 1000px 20px;
}
.main-content section .edition .preview > div:first-child{
    border-right: 1px solid #dddddd;
}
.main-content section .edition .preview i{
    color: #999;
    line-height: 20px;
}
.main-content section .edition .preview a i{
    color: #CCC;
}
.main-content section .edition .preview .social{
    margin: 20px 0;
}
.main-content section .edition .preview span{
    font-size: 24px;
    font-weight: bold;
    line-height: 1;
}
.main-content section .edition .preview .stats p{
    margin: 5px 0 15px 0;
}
.main-content section .edition .preview hr{
    display: none;
}
.main-content section .edition .suggestions{
    margin: 40px 0;
}
.main-content section .edition .suggestions ul{
    margin: 25px 0;
    padding-left: 20px;
}
.main-content section .edition .suggestions li{
    line-height: 20px;
    padding: 7px 0;
    font-size: 18px;
}
.main-content section .edition .suggestions li span{
    color: #f0111a;
    font-weight: bold;
}
.main-content section .edition .ssg-confirm{
    margin-top: 60px;
}
.main-content section .edition .ssg-confirm input{margin-top: 0;}
.main-content section .edition .ssg-confirm label{
        font-weight: normal;
}

.main-content section nav{
    height: 100px;
}
.main-content section nav button{
    border: 1px solid #dddddd;
    -webkit-border-radius: 15px;
    -moz-border-radius:    15px;
    border-radius:         15px;
    color: #666666;
    line-height: 28px;
    margin-top: 35px;
    padding: 0 11px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.main-content section nav button:hover{
    background-color: #F2515E;
    border-color: #F2515E;
    color: #FFF;
}
.main-content section nav i{
    margin: 0 3px;
    vertical-align: middle;
}
.main-content section nav span{
    margin: 0 3px;
    font-size: 12px;
    vertical-align: middle;
}
.main-content section .edition nav button{
    -webkit-border-radius: 20px;
    -moz-border-radius:    20px;
    border-radius:         20px;
    height: 40px;
    margin-top: 0;
    padding: 0 15px;
}
.main-content section .edition nav button span{
    font-size: 14px;
    margin: 0 4px;
}
.main-content section .edition nav button i{
    margin: 0 4px;
}
.main-content section .edition nav button.red-bg{
    border-color: #F2515E;
    color: #FFF;
    font-weight: bold;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.main-content section .edition nav button.red-bg:hover{
    background-color: #f0111a;
    border-color: #f0111a;
}
.main-content section .edition nav .no-border{
    border: none;
    background-color: transparent;
}
.main-content section .edition nav .no-border:hover{
    background-color: #ffffff;
    color: #999;
}
.main-content section .edition nav button.draft span:before{
    content: "Save as ";
}

.quick-faq {
    text-align: left;
    line-height: 30px;
    margin-left: 20px;
    margin-top: 12px;
    color: #666;
    float: left;
    font-size: 12px;

}
.quick-faq:hover{ 
    color: #F2515E;
    cursor: help;
}

.h2-parent a{
    color: #999;
    margin-right: 10px !important;
}
.h2-parent a:hover{
    color: #F2515E;
    text-decoration: none;
}
.cta-small{
    display: none;
}
.cta-big{
    display: block;
}

/* OVERVIEW */


.overview .social-total{
    -webkit-border-radius: 5px;
    -moz-border-radius:    5px;
    border-radius:         5px;
    margin: 10px 0;
    overflow: hidden;
}
.overview .social-total .Spreaders{
    position: relative;
    padding: 20px;
    color: #FFF;
}
.overview .social-total .Spreaders h3{
    position: relative;
    font-weight: bold;
    font-size: 16px;
    margin: 0;
    z-index: 2;
}
.overview .social-total .Spreaders span{
    position: relative;
    font-size: 42px;
    font-weight: bold;
    z-index: 2;
}
.overview .social-total .Spreaders .fa{
    display: block;
    position: absolute;
    right: 0px;
    bottom: 0px;
    z-index: 1;
    color: rgba(0, 0, 0, 0.1);
    font-size: 100px;
}
.overview .social-total .tile-footer{
    border: 1px solid #DDD;
    background-color: #fff;
    border-top: none;
    padding: 10px;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}
.overview .social-total .tile-footer p{
    height: 30px;
    line-height: 30px;
    margin: 0px;
}
.overview .social-total .tile-footer p .reach{
    float: right;
    font-weight: bold;
    line-height: 30px;
}
.overview .shout-content p{
    text-align: center;
    font-style: italic;
    margin: 20px 0;
    font-size: 20px;
    font-weight: bold;
}
.overview .chart-box{
    border: 1px solid #DDD;
    -webkit-border-radius: 5px;
    -moz-border-radius:    5px;
    border-radius:         5px;
    margin: 10px 0;
    overflow: hidden;
    background-color: #fff;
}
.overview .chart-box .chart-title{
    font-size: 16px;
    font-weight: bold;
    margin: 0;
    padding: 10px;
    border-bottom: 1px solid #DDD;
    background-color: #F6F6F6;
}
.overview .chart-box .table{
    margin: 0;
}
.overview .chart-box .tile-group{
    margin: 0;
    -webkit-border-radius: 0px;
    -moz-border-radius:    0px;
    border-radius:         0px;
}
.overview .chart-box .tile-group .tile-entry{
    border-color: #373737;
    background-color: transparent;
}
.overview .chart-box .tile-group .tile-entry:not(:first-child){
  border-top: 1px solid #ddd;
}
.overview .chart-box .tile-group .tile-entry h4{
    color: #000;
}
.overview .chart-box .tile-group .tile-entry span{
    color: #000;
}
.overview .tile-1{background-color: #3B5998;}
.overview .tile-2{background-color: #00A3D9;}
.overview .tile-3{background-color: #F2515E;}

section .summary{
    padding: 0px;
    margin-bottom: 10px;
}
/* END OVERVIEW */
/* END MAIN SECTION */
/* END WHITE BLOCK  */

/* MORRIS CHART */
.morris-hover {
  position: absolute;
  z-index: 1000;
}
.morris-hover.morris-default-style {
    border-radius: 10px;
    padding: 6px;
    color: #666;
    background: rgba(255, 255, 255, 0.8);
    border: solid 2px rgba(230, 230, 230, 0.8);

    font-family: sans-serif;
    font-size: 12px;
    text-align: center;
}
.morris-hover.morris-default-style .morris-hover-row-label {
      font-weight: bold;
      margin: 0.25em 0;
}

.morris-hover.morris-default-style .morris-hover-point {
      white-space: nowrap;
      margin: 0.1em 0;
}
/* END MORRIS CHART */

/* JVECTORMAP */

.tile-group {
  margin-bottom: 20px;
  overflow: hidden;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  display: table;
  width: 100%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.tile-group:before,
.tile-group:after {
  content: " ";
  /* 1 */

  display: table;
  /* 2 */

}
.tile-group:after {
  clear: both;
}
.tile-group:before,
.tile-group:after {
  content: " ";
  /* 1 */

  display: table;
  /* 2 */

}
.tile-group:after {
  clear: both;
}
.tile-group .tile-left,
.tile-group .tile-right {
  display: table-cell;
  position: relative;
}
.tile-group .tile-left .map,
.tile-group .tile-right .map {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: 1px 0;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.tile-group .tile-left {
  width: 40%;
}
.tile-group .tile-right {
  width: 60%;
}
.tile-group .tile-entry {
  padding: 25px 30px;
}
.tile-group .tile-entry span,
.tile-group .tile-entry h3,
.tile-group .tile-entry h4 {
  display: block;
  margin: 0;
}
.tile-group .tile-entry span {
  font-size: 11px;
}
.tile-group .tile-entry h3 + span,
.tile-group .tile-entry h4 + span {
  margin-top: 4px;
}
.tile-group .tile-entry .op {
  -webkit-opacity: 0.5;
  -moz-opacity: 0.5;
  opacity: 0.5;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  filter: alpha(opacity=50);
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
.tile-group .tile-entry:hover .op {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}
.tile-group div > tile-entry:last-child {
  border-bottom: 0;
}
.tile-group .jvectormap-zoomin,
.tile-group .jvectormap-zoomout {
  width: 16px;
  height: 16px;
  margin-bottom: 4px;
  padding: 0;
  text-align: center;
  line-height: 16px;
  background-color: #FFF;
  color: #000;
}

/* END JVECTORMAP */

/*****************/
/* MEDIA QUERIES */
/*****************/
/* width 1120px & under */
@media (max-width: 1120px){
    .main-content header .url span{
        display: none;
    }
    .main-content header .url .fa-link{
        display: inline;
    }
}
/* width 1024px & under */
@media (max-width: 1024px){
    aside{
        left: -240px;
    }
    aside.open{
        left: 0;
    }
    .main-content {
        margin: 0;
    }
    .main-content header .user{
        margin: 0;
    }
    .main-content header .open-sidebar{
        display: block;
    }
    .main-content.push{
        margin-left: 240px;
        margin-right: -240px;
    }
}

/* width 768px & under */
@media (max-width: 768px){
    aside .logo{
        line-height: 60px;
    }
    .main-content header{
        height: 60px;
        line-height: 60px;
    }
    .main-content header .open-sidebar{
        height: 60px;
        line-height: 60px;
    }
    .main-content header .user img{
        height: 30px;
    }
    .main-content header .user li{
        height: 40px;
    }
    .main-content header .user li .name{
        height: 40px;
        line-height: 40px;
        margin: 0 22px 0 40px;
    }
    .main-content header .user li i{
        height: 40px;
        line-height: 40px;
    }
    .main-content header .user li img{
        margin-top: 5px;
    }
    .main-content header .edit span{
        display: none;
    }
    .main-content header .search{
        margin: 0 0 0 10px;
    }
    .main-content header .search input{
        padding: 0;
        width: 30px;
    }
    .main-content header .search ::-webkit-input-placeholder:before { /* WebKit browsers */
        color:    #ccc;
        content: "";
    }
    .main-content header .search :-moz-placeholder:before { /* Mozilla Firefox 4 to 18 */
        color:    #ccc;
        content: "";
    }
    .main-content header .search ::-moz-placeholder:before { /* Mozilla Firefox 19+ */
        color:    #ccc;
        content: "";
    }
    .main-content header .search :-ms-input-placeholder:before { /* Internet Explorer 10+ */
        color:    #ccc;
        content: "";
    }
    .main-content header .search i{
        top: 23px;
    }
    .main-content section .shout .shout-foot a span{
        display: none;
    }
    .overview .social-total .Spreaders h3{
    font-size: 14px;
}
.main-content header .user .set-up {
    margin-top: 10px;
}
}
/* width 639px & under */
@media (max-width: 640px){
    .main-content header .url{
        display: none;
    }
    .main-content section .main-top{
        height: 150px;
    }
    .main-content section .main-top h2{
        float: none;
    }
    .main-content section .main-top .red-button{
        float: left;
        margin-left: 0px;
    }
    .main-content section .main-top .sort{
        float: left;
        margin-left: 20px;
    }
    .main-content section .edition .group-select select{
        margin-bottom: 15px;
        float: none;
    }
    .main-content section .edition .group-select button{
        margin: 0;
    }
    .main-content section .edition nav button span{
        font-size: 12px;
    }
    .main-content section .edition .preview > div:first-child{
        border-right: none;
        margin-bottom: 0;
        padding-bottom: 20px;
    }
    .main-content section .edition .preview hr{
        display: block;
    }
    .main-content section table th{
        padding: 0 10px;
    }
    .main-content section table td{
        padding: 0 10px;
    }
    .main-content section table td img{
        display: none;
    }
    .overview .social-total{
        text-align: left;
        margin: 10px;
    }
    .overview .social-total h3{
        display: inline;
        margin: 0;
    }
    .overview .social-total span{
        float: right;
    }
    .cta-small{
        display: block;
    }
    .cta-big{
        display: none;
    }
}
/* width 480px & under */
@media (max-width: 480px){
    .main-content header .user img{
        display: none;
    }
    .main-content header .user span{
        font-size: 14px;
        font-weight: bold;
        margin: 0 10px 0 0;
    }
    .main-content header .user li .name{
        font-size: 14px;
        height: 40px;
        line-height: 40px;
        margin: 0 22px 0 0px;
    }
    .main-content header .search input:focus{
        left: 20px;
        position: absolute;
        top: 15px;
        right: 70px;
        width: auto;
    }
    .main-content section .main-top.has-steps{
        height: 140px;
    }
    .main-content section .main-top .sort label{
        display: none;
    }
    .main-content section .main-top .red-button span{
        display: none;
    }
    .main-content section .main-top.has-steps h2{
        float: none;
    }
    .main-content section .main-top.has-steps .steps{
        float: none;
        line-height: 28px;
    }
    .main-content section .main-top.has-steps .steps .circle{
        -webkit-border-radius: 15px;
        -moz-border-radius:    15px;
        border-radius:         15px;
        font-size: 14px;
        text-align: center;
        width: 30px;
    }
    .main-content section .edition fieldset label.btn{
        padding: 0 12px;
    }
    .main-content section .edition fieldset select{
        max-width: 480px;
        width: 100%;
    }
    .main-content section .shout .shout-foot{
        line-height: 40px;
        height: 100px;
        padding: 10px 0;
    }
    .main-content section .shout .shout-foot > *{
        float: none;
    }
    .main-content section .shout .shout-foot button{
        float: right;
        margin-top: 5px;
    }
    .main-content section .edition nav button.previous span{
        display: none;
    }
    .main-content section .edition nav button.draft span:before{
        content: "";
    }
    .main-content section table select{
        display: block;
    }
    .main-content section table .dropdown{
        display: none;
    }
    .main-content section{
        padding: 0 20px;
    }
}
@media (min-width: 480px){
    .table-responsive{
        overflow: visible !important;
    }
}

.th-fb {
    color: #3B5998 !important;
}

.th-tw {
    color: #00A3D9 !important;
}


@media (max-width: 300px){
    .cta-small{
        display: none;
    }
}

/*TOOLTIPSTER*/

/* This is the default Tooltipster theme (feel free to modify or duplicate and create multiple themes!): */
.tooltipster-default {
    border-radius: 5px; 
    border: 1px solid #000;
    background: #4c4c4c;
    color: #fff;
    box-sizing: content-box;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
}

/* Use this next selector to style things like font-size and line-height: */
.tooltipster-default .tooltipster-content {
    font-size: 12px;
    line-height: 16px;
    padding: 8px 10px;
    overflow: hidden;
}

/* This next selector defines the color of the border on the outside of the arrow. This will automatically match the color and size of the border set on the main tooltip styles. Set display: none; if you would like a border around the tooltip but no border around the arrow */
.tooltipster-default .tooltipster-arrow .tooltipster-arrow-border {
    /* border-color: ... !important; */
}


/* If you're using the icon option, use this next selector to style them */
.tooltipster-icon {
    cursor: help;
    margin-left: 4px;
}








/* This is the base styling required to make all Tooltipsters work */
.tooltipster-base {
    padding: 0;
    font-size: 0;
    line-height: 0;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 9999999;
    pointer-events: none;
    width: auto;
    overflow: visible;
}
.tooltipster-base .tooltipster-content {
    overflow: hidden;
}


/* These next classes handle the styles for the little arrow attached to the tooltip. By default, the arrow will inherit the same colors and border as what is set on the main tooltip itself. */
.tooltipster-arrow {
    display: block;
    text-align: center;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.tooltipster-arrow span, .tooltipster-arrow-border {
    display: block;
    width: 0; 
    height: 0;
    position: absolute;
}
.tooltipster-arrow-top span, .tooltipster-arrow-top-right span, .tooltipster-arrow-top-left span {
    border-left: 8px solid transparent !important;
    border-right: 8px solid transparent !important;
    border-top: 8px solid;
    bottom: -7px;
}
.tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-top-left .tooltipster-arrow-border {
    border-left: 9px solid transparent !important;
    border-right: 9px solid transparent !important;
    border-top: 9px solid;
    bottom: -7px;
}

.tooltipster-arrow-bottom span, .tooltipster-arrow-bottom-right span, .tooltipster-arrow-bottom-left span {
    border-left: 8px solid transparent !important;
    border-right: 8px solid transparent !important;
    border-bottom: 8px solid;
    top: -7px;
}
.tooltipster-arrow-bottom .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border {
    border-left: 9px solid transparent !important;
    border-right: 9px solid transparent !important;
    border-bottom: 9px solid;
    top: -7px;
}
.tooltipster-arrow-top span, .tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-bottom span, .tooltipster-arrow-bottom .tooltipster-arrow-border {
    left: 0;
    right: 0;
    margin: 0 auto;
}
.tooltipster-arrow-top-left span, .tooltipster-arrow-bottom-left span {
    left: 6px;
}
.tooltipster-arrow-top-left .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border {
    left: 5px;
}
.tooltipster-arrow-top-right span,  .tooltipster-arrow-bottom-right span {
    right: 6px;
}
.tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border {
    right: 5px;
}
.tooltipster-arrow-left span, .tooltipster-arrow-left .tooltipster-arrow-border {
    border-top: 8px solid transparent !important;
    border-bottom: 8px solid transparent !important; 
    border-left: 8px solid;
    top: 50%;
    margin-top: -7px;
    right: -7px;
}
.tooltipster-arrow-left .tooltipster-arrow-border {
    border-top: 9px solid transparent !important;
    border-bottom: 9px solid transparent !important; 
    border-left: 9px solid;
    margin-top: -8px;
}
.tooltipster-arrow-right span, .tooltipster-arrow-right .tooltipster-arrow-border {
    border-top: 8px solid transparent !important;
    border-bottom: 8px solid transparent !important; 
    border-right: 8px solid;
    top: 50%;
    margin-top: -7px;
    left: -7px;
}
.tooltipster-arrow-right .tooltipster-arrow-border {
    border-top: 9px solid transparent !important;
    border-bottom: 9px solid transparent !important; 
    border-right: 9px solid;
    margin-top: -8px;
}


/* Some CSS magic for the awesome animations - feel free to make your own custom animations and reference it in your Tooltipster settings! */

.tooltipster-fade {
    opacity: 0;
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    -ms-transition-property: opacity;
    transition-property: opacity;
}
.tooltipster-fade-show {
    opacity: 1;
}

.tooltipster-grow {
    -webkit-transform: scale(0,0);
    -moz-transform: scale(0,0);
    -o-transform: scale(0,0);
    -ms-transform: scale(0,0);
    transform: scale(0,0);
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    -ms-transition-property: -ms-transform;
    transition-property: transform;
    -webkit-backface-visibility: hidden;
}
.tooltipster-grow-show {
    -webkit-transform: scale(1,1);
    -moz-transform: scale(1,1);
    -o-transform: scale(1,1);
    -ms-transform: scale(1,1);
    transform: scale(1,1);
    -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
    -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
    -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
    -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
    transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
}

.tooltipster-swing {
    opacity: 0;
    -webkit-transform: rotateZ(4deg);
    -moz-transform: rotateZ(4deg);
    -o-transform: rotateZ(4deg);
    -ms-transform: rotateZ(4deg);
    transform: rotateZ(4deg);
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    -ms-transition-property: -ms-transform;
    transition-property: transform;
}
.tooltipster-swing-show {
    opacity: 1;
    -webkit-transform: rotateZ(0deg);
    -moz-transform: rotateZ(0deg);
    -o-transform: rotateZ(0deg);
    -ms-transform: rotateZ(0deg);
    transform: rotateZ(0deg);
    -webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 1);
    -webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); 
    -moz-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); 
    -ms-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); 
    -o-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); 
    transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
}

.tooltipster-fall {
    top: 0;
    -webkit-transition-property: top;
    -moz-transition-property: top;
    -o-transition-property: top;
    -ms-transition-property: top;
    transition-property: top;
    -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
    -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
    -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
    -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
    transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
}
.tooltipster-fall-show {
}
.tooltipster-fall.tooltipster-dying {
    -webkit-transition-property: all;
    -moz-transition-property: all;
    -o-transition-property: all;
    -ms-transition-property: all;
    transition-property: all;
    top: 0px !important;
    opacity: 0;
}

.tooltipster-slide {
    left: -40px;
    -webkit-transition-property: left;
    -moz-transition-property: left;
    -o-transition-property: left;
    -ms-transition-property: left;
    transition-property: left;
    -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
    -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
    -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
    -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
    transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
}
.tooltipster-slide.tooltipster-slide-show {
}
.tooltipster-slide.tooltipster-dying {
    -webkit-transition-property: all;
    -moz-transition-property: all;
    -o-transition-property: all;
    -ms-transition-property: all;
    transition-property: all;
    left: 0px !important;
    opacity: 0;
}


/* CSS transition for when contenting is changing in a tooltip that is still open. The only properties that will NOT transition are: width, height, top, and left */
.tooltipster-content-changing {
    opacity: 0.5;
    -webkit-transform: scale(1.1, 1.1);
    -moz-transform: scale(1.1, 1.1);
    -o-transform: scale(1.1, 1.1);
    -ms-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}

